<template>
	<cl-dialog
		title="离职员工恢复"
		width="400px"
		:visible.sync="visible"
		:before-close="beforeClose"
		@close="close"
		:props="{
			closeOnClickModal: false
		}"
	>
		<el-form ref="form" :model="form" :rules="rules" :disabled="saving" label-width="70px">
			<div class="prompt-text">此操作将恢复已离职的员工</div>
			<el-form-item label="权限组" prop="ro_id">
				<cl-select
					v-model="form.ro_id"
					placeholder="请选择权限组"
					filterable
					style="width: 100%"
				>
					<el-option
						v-for="item in roleList"
						:key="item.ro_id"
						:label="item.ro_name"
						:value="item.ro_id"
					/>
				</cl-select>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="close">关闭</el-button>
			<el-button type="primary" @click="submit" :loading="saving">确定</el-button>
		</template>
	</cl-dialog>
</template>

<script>
	export default {
		data() {
			return {
				visible: false,
				saving: false,

				biz_id: null,
				is_teacher: null,
				form: {
					user_id: "",
					ro_id: ""
				},
				rules: {
					ro_id: [{ required: true, message: "请选择权限组" }]
				},
				roleList: [] //权限数据
			};
		},
		methods: {
			open(obj = {}) {
				this.biz_id = obj.biz_id;
				this.is_teacher = obj.is_teacher;
				this.form.user_id = obj.user_id;
				// Object.keys(this.form).forEach((key) => {
				// 	this.form[key] = data[key];
				// });
				this.init()

				this.visible = true;
			},
			init() {
				this.getRoleList();
			},
			async getRoleList() {
				this.roleList = [];
				const data = await this.$service.role.list({
					status: 1,
					biz_id: this.biz_id,
					is_teacher: this.is_teacher
				});
				this.roleList = (data || []).filter((v) => v.is_super != 1);
			},
			beforeClose(done) {
				if (this.saving) return;
				done();
			},
			close() {
				if (this.saving) return;
				this.visible = false;
				this.reset();
			},
			reset() {
				this.saving = false;
				this.$refs.form.resetFields();
			},
			submit() {
				this.$refs.form.validate(async (valid, errors) => {
					this.showFormErr(errors);
					if (!valid) return;
					this.$service.user.resume(this.form).then(() => {
						this.$message.success("员工恢复成功！");
						this.$emit("confirm");
						this.saving = false;
						this.close();
					});
				});
			}
		}
	};
</script>

<style lang="scss" scoped>
	.prompt-text {
		margin-left: 10px;
		margin-bottom: 10px;
		font-size: 12px;
		color: red;
	}
</style>
